import React from 'react';
import { connect } from 'umi';
import { Divider, Tooltip, message } from 'antd';
import { isSuccess } from '@/utils/request';
import { BUTTON } from '@/pages/SalaryManage/SalaryCalculate/constant/recheckButtonConstant';
import { CHECK_STATUS } from '@/pages/SalaryManage/constant/recheckConstant';

import { goToSalaryRecheckDataChart } from '@/pages/SalaryManage/utils/pageNavigateUtil';

const OperateCell = props => {
    const { record, dispatch, dispatchType } = props
    const showRejectModal = prop => {
        if (prop.disabled) {
            return;
        }
        dispatch({
            type: dispatchType.rejectInitType,
            payload: {
                visible: true,
                record
            }
        });
    };
    const cancelCheck = prop => {
        if (prop.disabled) {
            return;
        }
        dispatch({
            type: dispatchType.cancelCheckType,
            payload: record.id,
            callback(response) {
                if (!isSuccess(response)) {
                    message.error(response.msg);
                    return;
                }
                message.success('取消复核成功');
            }
        });
    };

    const passCheck = prop => {
        if (prop.disabled) {
            return;
        }
        dispatch({
            type: dispatchType.passCheckType,
            payload: record.id,
            callback(response) {
                if (!isSuccess(response)) {
                    message.error(response.msg);
                    return;
                }
                message.success('复核通过');
            }
        });
    };

    const goToDataDetail = () => {
        goToSalaryRecheckDataChart({
            employeeCode: record.employeeCode,
            yearMonth: record.yearMonth,
            organizationCode: record.organizationCode
        });
    };
    const btnArray = [];
    const buttons = record.buttons || [];

    buttons.forEach(button => {
        if (BUTTON.HR_REJECT === button.code || BUTTON.FN_REJECT === button.code) {
            btnArray.push({
                name: button.disabled ? null : '驳回',
                fontClass: 'status_reject iconlistfunction_reject_icon_default',
                onClick: showRejectModal,
                disabled: button.disabled,
                prop: button
            });
        }

        if (BUTTON.DATA_DETAIL === button.code || BUTTON.FINAL_DATA_DETAIL === button.code) {
            btnArray.push({
                name: button.disabled ? null : '数据详情',
                fontClass: 'status_cancel iconshujuxiangqing',
                onClick: goToDataDetail,
                disabled: button.disabled,
                prop: button
            });
        }

        if (
            (BUTTON.HR_CANCEL_CHECK === button.code && CHECK_STATUS.CHECKED.code === record.hrCheckStatus) ||
            (BUTTON.FN_CANCEL_CHECK === button.code && CHECK_STATUS.CHECKED.code === record.financeCheckStatus)
        ) {
            btnArray.push({
                name: button.disabled ? null : '取消复核',
                fontClass: 'status_cancel iconlistfunction_auditcanceled_icon_default',
                onClick: cancelCheck,
                disabled: button.disabled,
                prop: button
            });
        }

        if (
            (BUTTON.HR_PASS_CHECK === button.code && CHECK_STATUS.CHECKED.code !== record.hrCheckStatus) ||
            (BUTTON.FN_PASS_CHECK === button.code && CHECK_STATUS.CHECKED.code !== record.financeCheckStatus)
        ) {
            btnArray.push({
                name: button.disabled ? null : '复核通过',
                fontClass: 'status_approve iconlistfunction_auditpassed_icon_default',
                onClick: passCheck,
                disabled: button.disabled,
                prop: button
            });
        }
    });

    return (
        <div>
            {btnArray.map((item, index, arr) => (
                <React.Fragment key={item.name || index}>
                    <Tooltip title={item.name}>
                        <i
                            className={['iconfont', item.fontClass, { p_status_disable: item.disabled }]}
                            onClick={() => item.onClick(item)}
                        />
                    </Tooltip>
                    {index + 1 < arr.length ? <Divider type="vertical" /> : null}
                </React.Fragment>
            ))}
        </div>
    );
};

export default connect()(OperateCell);
